window.requestAnimFrame = (function() {
	return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
		function( /* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
			return window.setTimeout(callback, 1000 / 60);
		};
})();


function Swipe(obj){  //swipe滑动  
	var el = obj.find(":first");

	var swipe = {};
	var slides = el.find("li");

	var width = obj.width();
	var height = obj.height();
    var len = slides.length;

	for(var i= 0;i<len;i++){
		var slide = slides.eq(i);
		slide.css({
		"width":width+'px',
		"height":height+'px'
		})
	}

    ///ps:js里面的对象{}  object  dom对象，
    ///复制时都只是创建了一个原对象的引用，复制者还是指向原来的对象
	swipe.scrollTo = function(x,speed){
		el.css({                               ///这里是闭包 用到外部对象el
			"transition-timing-function":'linear',
			'transition-duration':speed+'ms',
			'transform':'translate3d(-'+x+'px,0px,0px)'  
			 //这里纠结半天 ，translate3d 
             ///是以圆目标对象最初最左上角位置为原点，x.y.z 是距离该原点的距离 
             ///就算移动多次也是以最初的左上角的top left 为原点
             ///即在原位置进行偏移 ，相应的其他translateX|Y|Z 都是如此
		})
		return this;
	}

	return swipe;
}

function getValue(className){
	var el = $(""+className+"");
	return {
		height:el.height(),
		top:el.position().top
	}
}

function transition(obj,x,y,speed,option){
	option = option || 'linear'; 
	if(obj){
		obj.css({
            "transition-timing-function":'linear',
			'transition-duration':speed+'ms',
			'transform':'translate3d('+x+'px,'+y+'px,0px)'
		})
	}
}

/*男孩*/
function Boy(obj){
	this._boy = obj;

	this.height = obj.height();
	this.width = obj.width();
    
    this.top ;
    this.left;

    this.setPos = function(top,left){
    	this.top = top;
    	this.left = left;
    	this._boy.css({
             "top":top+"px",
             'left':left+"px"
    	})
    }

    this.getPos = function(){
    	return {
    		top:this._boy.position().top,
    		left:this._boy.position().left
    	}
    }
    this.dynamic = function(className){
       this._boy.addClass(className);
    }
    this.static = function(className){
       this._boy.addClass(className);
    }
	this.walkTo = function(x,y,speed,option){
		var dfd = $.Deferred();
	    option    =  option || "linear";
        var delx  =  x- this.left;
        var dely  =  y-this.top;
        var ob    =  this._boy;
        setTimeout(function(){  
       	   transition(ob,delx,dely,speed,option);
       	   setTimeout(function(){
	          	dfd.resolve();	
	       },speed)
	    
        },0);
        return dfd;
	}

	this.stopWalk = function(speed){
		var dfd = $.Deferred();
        var x      =   this._boy.position().left;
        var y      =   this._boy.position().top;
        var delx   =   x-this.left;
        var dely   =   y-this.top;
       	transition(this._boy,delx,dely,speed,"linear"); 
       //transition(this._boy,x,y,speed,"linear");
        setTimeout(function(){
	    	dfd.resolve();	
	    },speed)
	    return dfd;
	}

	this.inShop = function(speed){
		 var dfd = $.Deferred();
		 var x      =   this._boy.position().left;
         var y      =   this._boy.position().top;
         this._boy.css({
             "transition-timing-function":"linear",
             'transition-duration':speed+'ms',
             'transform':"scale(0.3,0.3)",
             "opacity":"0",
             "left":x+"px",
             "top":y+"px"
         })
         this.left = x;
         this.top  =  y;
        setTimeout(function(){
	    	dfd.resolve();	
	    },speed)
	    return dfd;
	}

	this.outShop = function(speed){
		var dfd = $.Deferred();
		this.changeAnim("haveFlower","infinite");
		 this._boy.css({
             "transition-timing-function":"linear",
             'transition-duration':speed+'ms',
             'transform':"scale(1,1)",
             "opacity":"1",
         })
         setTimeout(function(){
	    	dfd.resolve();	
	    },speed)
	    return dfd;
	}

	this.changeAnim = function(name,isinfinite){
        this._boy.css({
        	'animation-iteration-count':isinfinite,
        	"animation-name":name,
        	"animation-fill-mode":"forwards"  //留在最终状态
        })
	} 

	this.rotate  = function(){
		this.changeAnim("boyRotate","1");
	}
}


/*商店门*/
function Door(obj){
	this._door = obj;
	this._leftdoor = obj.find("div").eq(0);
	this._rightdoor = obj.find("div").eq(1);
	this.width = obj.width();
    this.left = $('.shop').eq(0).position().left+this._door.position().left+16;

	this.close = function(speed){
	    var x  = this.width/2;
	    var dfd = $.Deferred();
	    transition(this._leftdoor,0,0,speed-400);
	    transition(this._rightdoor,0,0,speed); 
	    setTimeout(function(){
	    	dfd.resolve();	
	    },speed)
	    return dfd;
	   
	}

	this.open = function(speed){
		var dfd = $.Deferred();
	    var x  = this.width;
	    transition(this._leftdoor,-1*x/2,0,speed-800);
	    transition(this._rightdoor,this.width,0,speed); 
	    setTimeout(function(){
	    	dfd.resolve();	
	    },speed)
	    return dfd;
	}
}

/*灯*/
var lamp={
	obj : $('.b_background').eq(0),
	bright:function(){
		this.obj.addClass("lamp-bright");
	},
	dark:function(){
		this.obj.removeClass("lamp-bright");
	}
}

/*鸟*/
var bird = {
	obj:$(".bird").eq(0),
	fly:function(speed){
		this.obj.addClass("birdFly");
		transition(this.obj,-1300,0,speed);
	}
}

/*女孩*/
function Girl(obj){
  this._girl = obj;
  this.left = this._girl.position().left;
  this.top = this._girl.position().top;
  this.rotate = function(){
  	 this._girl.addClass("girl_turn");
  }
}

/*花瓣*/
function fallFlowers(x,y){
	 var container = $("li").eq(2);
	 var width = container.width();
	 var height = container.height();
	 for(var i = 0;i<x;i++)
		for(var j =0;j<y;j++){
			//  background: url('../images/snowflake/snowflake1.png')  no-repeat;
			var div = $('<div></div>');
            
			div.addClass('snowflake');
		    var cnt =   Math.floor(Math.random()*3+4);
			var left =  (Math.random()+0.4)/2*width;
			var top =   Math.random()/2*height;
			div.css({
				"left":left+'px',
				"top" : top+'px',
				"background":"url('images/snowflake/snowflake"+cnt+".png') no-repeat"
			})
			container.append(div);
		}
     setTimeout(function(){
    	    for(var i=0;i<x*y;i++){$(".snowflake").eq(i).addClass("flow");}
     },1000)

}